@import "../ea-ui-base-style.scss";

.ea-pagination_wrap {
  display: flex;
  align-items: center;
  font-size: 0.9rem;

  .ea-pagination_item_wrap {
    display: flex;
    align-items: center;

    .ea-pagination_item,
    .ea-pagination_more {
      cursor: pointer;
      box-sizing: border-box;

      margin: 0 5px;
      padding: 0 4px;

      min-width: 30px;
      height: 28px;
      line-height: 28px;

      font-size: 13px;

      text-align: center;
    }

    .ea-pagination_item {
      &.ea-pagination_item--active {
        color: $color-primary-bgc;
      }
    }

    .ea-pagination_more {
      cursor: pointer;
      user-select: none;

      &.ea-pagination_more--active {
        color: $color-primary-bgc;
      }
    }
  }

  .ea-pagination_arrow {
    user-select: none;
    cursor: pointer;
    padding: 0 10px;

    line-height: 28px;

    &.disabled {
      cursor: default;
      pointer-events: none;
      color: $color-switch-disabled-text;
    }

    &:first-child {
      margin-right: 0.25rem;
    }

    &:last-child {
      margin-left: 0.25rem;
    }
  }

  .ea-pagination_item,
  .ea-pagination_more,
  .ea-pagination_arrow {
    &.background {
      background-color: #f4f4f5;
      border-radius: 3px;

      &:hover {
        color: $color-primary-bgc;
      }

      &.active {
        background-color: $color-primary-bgc;
        color: #f4f4f5;
      }
    }
  }

  .ea-pagination_show_total {
    margin-right: 0.5rem;
    font-size: 13px;
  }
}
